<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  
	<script type="text/javascript">
	
		function login_judge()
		{
			var username = document.getElementById("username");			//取得组件
			var password = document.getElementById("password");			//取得组件
			var repassword = document.getElementById("repassword");		//取得组件
			var gender = document.getElementsByName("gender");			//取得组件
			var interest = document.getElementsByName("interest");		//取得组件
			var comment = document.getElementsByName("comment")[0];		//取得组件


		//	var username = document.getElementsByName("username")[0]; 	//方法会取出一个数组
		
		//	var a = document.getElementsByTagName("input");//根据标签类型取得元素，返回一个数组
		//	alert(a.type);//也可以得到类型信息 比如：radio checkbox button等		
			
			
			if(username.value.length < 1) //JS判断字符串是否相等用==
			{
				alert("用户名不能为空");
				return false;	//返回false表示表格未提交
			}
			
			if(password.value.length < 6)
			{
				alert("密码长度最短为6位");
				return false;
			}
			
			if(password.value.length > 16)
			{
				alert("密码长度最长为16位");
				return false;
			}
			
			if(!gender[0].checked&&!gender[1].checked)
			{
				alert("请选择性别");
				return false;
			}
			
			if(comment.value.length < 1)
			{
				alert("请填写说明");
				return false;
			}			
			
			return true; 
		}
		
	</script>
	
  </head>
  
  <body>			<!-- onsubmit当提交表单的时候  调用login_judge()函数  并返回一个值-->
  	<form onsubmit="return login_judge()" action="/test/JS_Login" method="post">  
    	用户名：	<input type = "text" name="username" id="username" maxlength="16"><br>
    	密码：	<input type = "password" name= "password" id="password"><br>
    	性别：	男<input type = "radio" name = "gender" value = "男_value属性">&nbsp;&nbsp;
    			女<input type = "radio" name = "gender" value = "女_value属性"><br>
    	爱好：	足球<input type = "checkbox" name = "interest" value = "足球_value属性">&nbsp;&nbsp;
    			篮球<input type = "checkbox" name = "interest" value = "篮球_value属性">&nbsp;&nbsp;
    			排球<input type = "checkbox" name = "interest" value = "排球_value属性"><br>
    	地址：	<select name = "address">
    				<option value = "北京_value属性">北京</option>
    				<option value = "上海_value属性">上海</option>
    				<option value = "广州_value属性">广州</option>
    			</select><br>
    	说明：	<textarea name = "comment" rows = "15" cols = "20"></textarea><br>
				<input type = "submit" name = "submit" value = "提交">
    			
    			
    			
    </form>
  </body>
</html>
